import React, { Component } from 'react';
import { isFileExist } from '../util/commons-tools';
class Video extends Component {

    componentDidMount() {
        let video = document.getElementsByTagName("video")[0]
        video.load();
        video.play();
    }

    componentWillReceiveProps(nextProps) {
        let video = document.getElementsByTagName("video")[0]
        video.load();
        video.play();
    }

    onEnded = () => {
        this.props.startNextMedia()
    }

    render() {
        let url = this.props.media && this.props.media.Name.split("/")
        url = `downloadFile/${url[url.length - 1]}`

        return (
            <div>
                <video ref="video" style={{ width: "100%",maxHeight:"1080px",backgroundColor:"#000" }}
                    onPlay={this.onPlay}
                    onEnded={this.onEnded}
                    // controls
                >
                    <source src={isFileExist(url) ? url : this.props.media.Name} type="video/mp4" />
                    <source src={isFileExist(url) ? url : this.props.media.Name} type="video/ogg" />
                    <source src={isFileExist(url) ? url : this.props.media.Name} type="video/webm" />
                    您的浏览器不支持 video 标签
                    </video>
            </div>

        );
    }
}

export default Video;
